<template>
  <div class="home">
    <div>
      <h4>是否准时进班</h4>
      <el-radio-group @change="changePunctuality" v-model="isPunctuality">
        <el-radio :label="1">提前进班</el-radio>
        <el-radio :label="2">准时进班</el-radio>
        <el-radio :label="3">偶尔迟到</el-radio>
        <el-radio :label="4">经常迟到</el-radio>
      </el-radio-group>
    </div>
    <div>
      <h4>是否布置作业</h4>
      <el-radio-group @change="changeWork" v-model="isWork">
        <el-radio :label="1">作业充足</el-radio>
        <el-radio :label="2">作业过少</el-radio>
        <el-radio :label="3">偶尔布置</el-radio>
        <el-radio :label="4">不布置</el-radio>
      </el-radio-group>
    </div>
    <div>
      <h4>是否复习</h4>
      <el-radio-group @change="changeReview" v-model="review">
        <el-radio :label="1">每天复习</el-radio>
        <el-radio :label="2">经常复习</el-radio>
        <el-radio :label="3">偶尔复习</el-radio>
        <el-radio :label="4">不复习</el-radio>
      </el-radio-group>
    </div>
    <div>
      <h4>意见</h4>
      <el-input
        class="w340"
        type="textarea"
        :rows="2"
        placeholder="请输入内容"
        v-model="textarea"
      >
      </el-input>
    </div>

    <div class="mt20">
      <el-button @click="sub" type="primary">提交</el-button>
    </div>
  </div>
</template>

<script>
import axios from "axios";
import getIPAddress from '@/utils/getIp'
export default {
  name: "Home",
  data() {
    return {
      isPunctuality: 1,
      isWork: 1,
      review: 1,
      textarea: "",
      name: ""
    };
  },
  created() {
    axios.get('/user/getUserInfo').then(res => {
      this.name = res.data[0].name
    })
  },
  methods: {
    changePunctuality(value) {
      this.isPunctuality = value;
    },
    changeWork(value) {
      this.isWork = value;
    },
    changeReview(value) {
      this.review = value;
    },
    sub() {
      const ip = getIPAddress()
      // console.log(ip)
      axios
        .get("/appraisal", {
          params: {
            punctuality: this.isPunctuality,
            work: this.isWork,
            review: this.review,
            textarea: this.textarea,
            ip,
            name: this.name
          },
        })
        .then((res) => {
          console.log(res);
        });
    },
  },
};
</script>

<style>
.w340 {
  width: 340px;
}
.mt20 {
  margin-top: 20px;
}
</style>
